
        //click: 鼠标点击事件
        document.querySelector('#b2').addEventListener('click', () => {
            console.log("我被点击了...");
        })

        //mouseenter: 鼠标移入
        document.querySelector('#last').addEventListener('mouseenter', () => {
            console.log("鼠标移入了...");
        })

        //mouseleave: 鼠标移出
        document.querySelector('#last').addEventListener('mouseleave', () => {
            console.log("鼠标移出了...");
        })

        //keydown: 某个键盘的键被按下
        document.querySelector('#username').addEventListener('keydown', () => {
            console.log("键盘被按下了...");
        })

        //keyup: 某个键盘的键被抬起
        document.querySelector('#username').addEventListener('keyup', () => {
            console.log("键盘被抬起了...");
        })

            // 修复方案1: 分别为每个元素添加事件监听
        document.querySelector('#age').addEventListener('blur', () => {
            console.log("年龄输入框失去焦点...");
        });

        document.querySelector('#username').addEventListener('blur', () => {
            console.log("用户名输入框失去焦点...");
        });

        // 修复方案2: 使用 querySelectorAll 同时选择多个元素
        document.querySelectorAll('#age, #username').forEach(input => {
            input.addEventListener('blur', () => {
                console.log("输入框失去焦点...");
            });
            
            input.addEventListener('focus', () => {
                console.log("输入框获得焦点...");
            });
        });

        //input: 用户输入时触发
        document.querySelector('#age').addEventListener('input', () => {
            console.log("用户输入时触发...");
        })

        //submit: 提交表单事件
        document.querySelector('form').addEventListener('submit', () => {
            alert("表单被提交了...");
        })